@charset "utf-8";
/* CSS Document */
/* 边距、补白和边界宽度都设置为0，当有溢出的时候设置为自动*/
* { 
	margin:0;
	border:0;             
	padding:0;
	text-decoration:none;
	list-style:none;
}
/*"*"表示对所有元素进行设置*/
a { color:#000;}
a:hover,a:active { cursor:pointer;}
/*上面这句话是为了能是代码在IE7一下的版本正常运行*/
body {
	width:100%;
	height:800px;
	font-family:arial, verdana, sans-serif;
	background:url(../images/big_bg.jpg) repeat;
	z-index:-100;
}
.content { 
	width:100%;
	height:600%;
	position:absolute;
}

.navigation {
	width:630px;
	height:100px;
	position:fixed;
	bottom:80px;
	right:20px;
}
.nav {
	margin-left:10px;
	height:96px;
	width:620px;
	background:url(../images/button_base.png) no-repeat bottom;
}

/*下面我用到的是float：right而不是left，为的是更好的控制li的排列*/
.nav a,.nav_name li {
	margin-right:15px;
	float:right;
	width:86px;
	height:86px;
}
/*a:hover是伪类，当鼠标停留或者经过nav的时候，图片移到有色图案。因为鼠标经过能够点亮的那几张图片，我用的是两张一样的图片合成的
86*86的图片我合成为172*86的左亮右黑白的图片，把这个图片作为背景放置在86*86的容器内，鼠标没有经过时显示的是黑白的，当鼠标经过的时候，
利用background—position这个属性使背景向左平移86px，从而达到目的*/
.nav a:hover,.nav a:active { background-position:0 0;}
.link { background:url(../images/link_2p.png)}
.album { background:url(../images/album_2p.png) -86px 0; }
.bulletin { background:url(../images/bulletin_2p.png) -86px 0; }
.bbs { background:url(../images/chat_2p.png) -86px 0; }
.contact { background:url(../images/contact_2p.png) -86px 0; }
.home { background:url(../images/home_2p.png) -86px 0; }
/*没有把nav和nav_name合并到一起的原因是，我们想当鼠标经过图片时，他们所对应的名字将会同时出现，这就要求把而这分开放置*/
.nav_name {
	margin-left:-25px;
	height:37px;
	width:660px;
}
.nav_name li {
	list-style:none;
	text-align:center;
}
.nav_name img { display:none;}

.section {
	width:100%;
	height:800px;
}
.bg_a { background:url(../images/background.jpg) no-repeat;}
.bg_b { background:url(../images/bg_link0.png) no-repeat;}
.link_nav {
	margin-top:25px;
	font-weight:bold;
	width:220px;
}
.link_nav li {
	width:140px;
	height:30px;
	text-indent:50px;
	line-height:30px;
	margin-top:10px;
	background:url(../images/link_li_bg.png) no-repeat;
	color:#609;
}
.link_nav a{ 
	color:#666;
	font-weight:500;
	display:block;
}
.link_nav a:hover,.link_nav a:active { 
	color:#609;
	font-weight:bold;
}
h2 { 
	padding-top:10px;
	padding-left:10px;
	color:#F30
}
.centerspace {
	width:1000px;
	height:380px;
	float:right;
	margin-right:120px;
	margin-top:-85px;
}
.centerspace div { 
	text-align:center;
	float:left;
	margin-left:30px;
	margin-bottom:18px;
}
.centerspace p {
	display:block;
	font-family:"微软雅黑";
	padding-top:10px;
}
.part_1_1{
	float:left;
	width:406px;
}
.part_1_2 { 
	float:left;
	padding-top:30px;
	width:500px;
}
.centerspace a:hover,.centerspace a:active { color:#F60;}
.centerspace a:visited { color:#03C;}
.centerspace img {border:1px dotted #FCC;}
.centerspace img:hover {border:1px dotted #F60;}
/******************************************实现右上方的两个小标签***********************************/
#our_label{
	width:232px;
	position:fixed;
	margin:0;
	padding:0;
	top:0;
	right:100px;
	list-style: none;
    z-index:999999;
}
/*其属性设置为fixe，他将会跟着滚动条一起运动*/
#our_label li {
    width: 108px;
    display:inline;
    float:left;    
}
#our_label a {
	width:116px;
	height:120px;
	display: block;
    float:none;
	text-decoration:none;
	text-align:center;
}
/*display设置为block可以使鼠标经过那一块的时候，都会有链接*/
.about_us a{background:url(../images/about_us.png) no-repeat;}
.contact_us a{background:url(../images/contact_us.png) no-repeat;}
/******************************************实现右上方的两个小标签***********************************/
